<template>
  <div>
    这是分类页面
  </div>
</template>

<script setup>

</script>

<style lang="scss" scoped>

</style>
<!-- <template>
  <n-button @click="showAddModal = true">添加文章</n-button>
  <n-table :bordered="false" :single-line="false">
    <thead>
      <tr>
        <th>文章id</th>
        <th>作者</th>
        <!~~ <th>文章标签</th> ~~>
        <th>文章内容</th>
        <th>操作</th>
      </tr>
    </thead>
    <tbody>
      <tr v-for="(item, index) in categoryList" :key="item._id">
        <td>{{ item._id }}</td>
        <td>{{ item.author.username }}</td>
        <!~~ <td>{{ item.title }}</td> ~~>
        <td>{{ item.content }}</td>
        <td>
          <n-space>
            <n-button @click="handleUpdate(item)">修改</n-button>
            <n-button @click="handleDel(item._id)">删除</n-button>
          </n-space>
        </td>
      </tr>
    </tbody>
  </n-table>
  <n-modal v-model:show="showAddModal">
    <n-card style="width: 600px" title="发布新文章">
      <div>
        <n-input v-model:value="Category.title" type="text" placeholder="请输入标题"></n-input>
        <n-input v-model:value="Category.content" type="textarea" placeholder="请输入内容 Textarea" />
        <!~~ <n-input v-model:value="addCategory.uid" type="text" placeholder="请输入用户id"></n-input> ~~>
      </div>
      <template #footer>
        <n-button @click="addCategory">提交</n-button>
      </template>
    </n-card>
  </n-modal>
  <n-modal v-model:show="updateAddModal">
    <n-card style="width: 600px" title="修改文章">
      <div>
        <n-input v-model:value="updateArt.title" type="text" placeholder="请输入标题"></n-input>
        <n-input v-model:value="updateArt.content" type="textarea" placeholder="请输入内容 Textarea" />
        <!~~ <n-input v-model:value="addCategory.uid" type="text" placeholder="请输入用户id"></n-input> ~~>
      </div>
      <template #footer>
        <n-button @click="updateCategory()">提交</n-button>
      </template>
    </n-card>
  </n-modal>
</template>

<script setup>
import { inject, onMounted, reactive, ref } from 'vue'
import { NTable, NButton, NSpace, NModal, NCard, NInput } from 'naive-ui'
import { AdminStore } from '../../../store/adminStore'

const axios = inject('axios')
const adminStore = AdminStore()
const categoryList = ref([])
// 添加
const showAddModal = ref(false)
const Category = reactive({
  title: '',
  content: '',
})
// 修改
const updateAddModal = ref(false)
const updateArt = reactive({
  id: 1,
  title: '',
  content: '',
})
// 注入组件
const message = inject('message')
const dialog = inject('dialog')

onMounted(() => {
  loadCategoryData()
})
// 初始化数据加载
const loadCategoryData = async () => {
  const result = await axios.get('/api/Articles/all')
  console.log('页面初始化', result);
  categoryList.value = result.data.data
}
// 发布文章
const addCategory = async () => {
  const result = await axios.post('/api/Articles', {
    data: {
      title: Category.title,
      content: Category.content
    }
  })
  console.log('发布文章', result);
  if (result.status === 200) {
    Category.title = Category.content = ''
    message.success('发布成功')
    loadCategoryData()
  }
  showAddModal.value = false
}
// 删除文章
const handleDel = async (art_id) => {
  dialog.warning({
    title: '警告',
    content: '是否删除',
    positiveText: '确定',
    negativeText: '取消',
    onPositiveClick: async () => {
      const result = await axios.delete('/api/Categorys/' + art_id)
      // console.log('删除文章',result);
      if (result.status === 200) {
        message.success('文章删除成功')
        loadCategoryData()
      } else {
        message.error('文章删除失败')
      }
    },
    onNegativeClick: () => {
      message.error('已取消')
    }
  })


}
// 修改文章
const handleUpdate = (item) => {
  updateAddModal.value = true
  updateArt.title = item.title
  updateArt.content = item.content
  updateArt.id = item._id
}
// 提交修改
const updateCategory = async () => {
  const result = await axios.patch(`/api/Categorys/${updateArt.id}`, {
    data: {
      title: updateArt.title,
      content: updateArt.content
    }
  })
  // console.log('修改',result);
  if (result.status === 200) {
    message.success('文章修改成功')
    updateArt.title = result.data.data.title
    updateArt.content = result.data.data.content
    updateAddModal.value = false
    loadCategoryData()
  } else {
    message.error('文章修改失败')
  }

}
</script>

<style lang="scss" scoped>

</style>
 -->